<template>

  <div class="background"></div>

  <div>
    <public-nav-bar></public-nav-bar>
  </div>

  <div class="searchBox">
    <author-search></author-search>
  </div>



</template>

<script>
import PublicNavBar from  '@/components/PublicNavBar'
import AuthorSearch from "@/authorIndex/components/authorSearch";
export default {
  name: "authorIndex",
  components: {
    AuthorSearch,
    PublicNavBar,
  },
  data() {
    return {
      url: require('../assets/thb_picture.jpg')
    }
  }
}
</script>

<style scoped>


.searchBox {
  margin-top: 6%;
}

.background {
  background-image: url("../assets/indexBackground.jpg");
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  z-index: -1;
  position: fixed;
  bottom: 0;
  opacity: 0.3;
}

</style>